
<form name="editForm" role="form" novalidate ng-submit="vm.save()" show-validation>

    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true"
                ng-click="vm.clear()">&times;</button>
        <h4 class="modal-title" id="myValueLabel" data-translate="gatewayApp.value.home.createOrEditLabel">Create or edit a Value</h4>
    </div>
    <div class="modal-body">
        <jhi-alert-error></jhi-alert-error>
        <div class="form-group" ng-show="vm.value.id">
            <label for="id" data-translate="global.field.id">ID</label>
            <input type="text" class="form-control" id="id" name="id"
                    ng-model="vm.value.id" readonly />
        </div>
        <div class="form-group">
            <label class="control-label" data-translate="gatewayApp.value.name" for="field_name">Name</label>
            <input type="text" class="form-control" name="name" id="field_name"
                    ng-model="vm.value.name"
                    required ng-maxlength="5000"/>
            <div ng-show="editForm.name.$invalid">
                <p class="help-block"
                    ng-show="editForm.name.$error.required" data-translate="entity.validation.required">
                    This field is required.
                </p>
                <p class="help-block"
                    ng-show="editForm.name.$error.maxlength" data-translate="entity.validation.maxlength" translate-value-max="5000">
                    This field cannot be longer than 5000 characters.
                </p>
            </div>
        </div>
        <div class="form-group">
            <label class="control-label" data-translate="gatewayApp.value.alias" for="field_alias">Alias</label>
            <input type="text" class="form-control" name="alias" id="field_alias"
                    ng-model="vm.value.alias"
                    />
        </div>
        <div class="form-group">
            <label class="control-label" data-translate="gatewayApp.value.image" for="field_image">Image</label>
            <input type="text" class="form-control" name="image" id="field_image"
                    ng-model="vm.value.image"
                    />
        </div>
        <div class="form-group">
            <label class="control-label" data-translate="gatewayApp.value.imagePro" for="field_imagePro">Image Pro</label>
                <input type="checkbox" name="imagePro" id="field_imagePro"
                          ng-model="vm.value.imagePro"/>
            <div ng-show="editForm.imagePro.$invalid">
                <p class="help-block"
                    ng-show="editForm.imagePro.$error.required" data-translate="entity.validation.required">
                    This field is required.
                </p>
            </div>
        </div>
        <div class="form-group">
            <label class="control-label" data-translate="gatewayApp.value.defaultImage" for="field_defaultImage">Default Image</label>
                <input type="checkbox" name="defaultImage" id="field_defaultImage"
                          ng-model="vm.value.defaultImage"/>
            <div ng-show="editForm.defaultImage.$invalid">
                <p class="help-block"
                    ng-show="editForm.defaultImage.$error.required" data-translate="entity.validation.required">
                    This field is required.
                </p>
            </div>
        </div>
        <div class="form-group">
            <label class="control-label" data-translate="gatewayApp.value.enabled" for="field_enabled">Enabled</label>
                <input type="checkbox" name="enabled" id="field_enabled"
                          ng-model="vm.value.enabled"/>
            <div ng-show="editForm.enabled.$invalid">
                <p class="help-block"
                    ng-show="editForm.enabled.$error.required" data-translate="entity.validation.required">
                    This field is required.
                </p>
            </div>
        </div>
        <div class="form-group">
            <label class="control-label" data-translate="gatewayApp.value.displayOrder" for="field_displayOrder">Display Order</label>
            <input type="number" class="form-control" name="displayOrder" id="field_displayOrder"
                    ng-model="vm.value.displayOrder"
                    />
        </div>
        <div class="form-group">
            <label class="control-label" data-translate="gatewayApp.value.langKey" for="field_langKey">Lang Key</label>
            <input type="text" class="form-control" name="langKey" id="field_langKey"
                    ng-model="vm.value.langKey"
                    ng-maxlength="8"/>
            <div ng-show="editForm.langKey.$invalid">
                <p class="help-block"
                    ng-show="editForm.langKey.$error.maxlength" data-translate="entity.validation.maxlength" translate-value-max="8">
                    This field cannot be longer than 8 characters.
                </p>
            </div>
        </div>

        <div class="form-group">
            <label data-translate="gatewayApp.value.property" for="field_property">Property</label>
            <select class="form-control" id="field_property" name="property" ng-model="vm.value.propertyId" ng-options="property.id as property.name for property in vm.properties"             required>
            </select>
        </div>
        <div ng-show="editForm.property.$invalid">
            <p class="help-block"
                ng-show="editForm.property.$error.required" data-translate="entity.validation.required">
                This field is required.
            </p>
        </div>
        <div class="form-group">
            <label data-translate="gatewayApp.value.category" for="field_category">Category</label>
            <select class="form-control" id="field_category" name="category" ng-model="vm.value.categoryId" ng-options="category.id as category.name for category in vm.categories"             required>
            </select>
        </div>
        <div ng-show="editForm.category.$invalid">
            <p class="help-block"
                ng-show="editForm.category.$error.required" data-translate="entity.validation.required">
                This field is required.
            </p>
        </div>
    </div>
    <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal" ng-click="vm.clear()">
            <span class="glyphicon glyphicon-ban-circle"></span>&nbsp;<span data-translate="entity.action.cancel">Cancel</span>
        </button>
        <button type="submit" ng-disabled="editForm.$invalid || vm.isSaving" class="btn btn-primary">
            <span class="glyphicon glyphicon-save"></span>&nbsp;<span data-translate="entity.action.save">Save</span>
        </button>
    </div>
</form>
